<template>
  <el-row :gutter="12">
    <el-col :span="8">
      <el-card class="box-card">
        <div class="item">
          <el-link type="primary" class="text" @click="numberTransfer()">用户名转账</el-link>
          <br><br><br><br>
          <span class="text-s">
            使用收款人用户名进行转账操作
          </span>
        </div>
      </el-card>
    </el-col>
    <el-col :span="8">
      <el-card class="box-card">
        <div class="item">
          <el-link type="primary" class="text" @click="phoneTransfer()">手机号转账</el-link>
          <br><br><br><br>
          <span class="text-s">
            使用收款人手机号进行转账操作
          </span>
        </div>
      </el-card>
    </el-col>
  </el-row>
</template>

<script>
export default {
  name: "index",
  methods:{//使用点击进行跳转
    numberTransfer(){
      this.$router.push("/numberTransfer");
    },
    phoneTransfer(){
      this.$router.push("/phoneTransfer");
    }
  }
}
</script>

<style scoped>
  .text {
    font-size: 28px;
    text-align: center;
    margin: 5px 110px 5px;
  }

  .text-s{
    font-size: 18px;
    text-align: center;
    margin: 50px;
  }

  .item {
    padding: 18px 0;
  }

  .box-card {
    width: 400px;
    margin: 160px;
  }

</style>
